<template>
  <div class="app">
    <h1>hello world</h1>
    <Person></Person>
    <Car></Car>
    <Person1></Person1>
    <Person2></Person2>
    <Person3></Person3>
    <Car1></Car1>
    <Person4></Person4>
  </div>
</template>

<script lang="ts">
import Person from "./components/Person.vue";
import Car from "./components/Car.vue";
import Person1 from "./components/Person1.vue";
import Person2 from "./components/Person2.vue";
import Person3 from "./components/Person3.vue";
import Car1 from "./components/Car1.vue";
import Person4 from "@/components/Person4.vue";

export default {
  name: 'App',
  components: {
    Person,
    Car,
    Person1,
    Person2,
    Person3,
    Car1,
    Person4
  }
}
</script>

<style scoped>
.app {
  background-color: #ddd;
  box-shadow: 0 0 10px;
  border-radius: 10px;
  padding: 20px;
}
</style>